<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>搜索</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">

    <meta name="description" content="Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.
">
    <link rel="stylesheet" href="lib/weui.min.css">
    <link rel="stylesheet" href="css/jquery-weui.css">
    <link rel="stylesheet" href="demos/css/demos.css">
    <link rel="stylesheet" href="font/fontscss/iconfont.css">
    <link rel="stylesheet" href="css/common.css">
    <script src="js/web/checkLogin.js"></script>
</head>
<body>
<div class="weui-search-bar" id="searchBar">
    <form class="weui-search-bar__form">
        <div class="weui-search-bar__box">
            <i class="weui-icon-search"></i>
            <input type="search" class="weui-search-bar__input" id="searchInput" placeholder="搜索" required="">
            <a href="javascript:" class="weui-icon-clear" id="searchClear"></a>
        </div>
        <label class="weui-search-bar__label" id="searchText">
            <i class="weui-icon-search"></i>
            <span>搜索</span>
        </label>
    </form>
    <a href="javascript:" class="weui-search-bar__cancel-btn" id="searchCancel">取消</a>
</div>
<div class="weui-cells weui-cells_radio">
    <label class="weui-cell weui-check__label" for="x11">
        <div class="weui-cell__bd">
            <p>cell standard</p>
        </div>
        <div class="weui-cell__ft">
            <input type="radio" class="weui-check" name="radio1" id="x11">
            <span class="weui-icon-checked"></span>
        </div>
    </label>
    <label class="weui-cell weui-check__label" for="x12">

        <div class="weui-cell__bd">
            <p>cell standard</p>
        </div>
        <div class="weui-cell__ft">
            <input type="radio" name="radio1" class="weui-check" id="x12">
            <span class="weui-icon-checked"></span>
        </div>
    </label>
</div>
<script src="lib/jquery-2.1.4.js"></script>
<script src="js/jquery-weui.js"></script>
<script type="text/javascript">
    $("#searchClear").click(function () {
        
    });
    $("#searchInput").bind('input propertychange', function() {
        $.showLoading();
        $(".weui-cells_radio").find("label").remove();

        $.ajax({
            type: "POST",
            url: "user/searchUser",
            async: false,
            data: {
                searchUser:$(this).val()
            },
            success: function (msg) {
                $.each(msg,function (index,val) {
                    var random=Math.random();
                    var str="";
                    str+="<label class=\'weui-cell weui-check__label\' for=\'x"+random+"\'>"
                    str+=""
                    str+="        <div class=\'weui-cell__bd\'>"
                    str+="            <p>"+val.username+"</p>"
                    str+="        </div>"
                    str+="        <div class=\'weui-cell__ft\'>"
                    str+="            <input type=\'radio\' name=\'radio1\' class=\'weui-check\' id=\'x"+random+"\'>"
                    str+="            <span class=\'weui-icon-checked\'></span>"
                    str+="        </div>"
                    str+="    </label>"
                    $(".weui-cells_radio").append(str);
                });
                $.hideLoading();
            }, error: function (XMLHttpRequest, textStatus, errorThrown) {
                $.toast("登录失败，请检查网络", "forbidden");
            }
        });

    });

</script>
</body>
</html>